/* 
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
var markers = [];
var map;
var site_url;
var index;
function clearMarker(markers) {
    for (var i = 0; i < markers.length; i++) {
        markers[i].setMap(null);
    }
    markers = [];
    return markers;
}
function showMarker(str1, str2) {
//        if (str1=="" && str2==""){
//            document.getElementById("result_ajax").innerHTML="Select an Employee for more details!";
//            return;
//        }
    // clear marker
    markers = clearMarker(markers);
    var xhr = false;
    if (window.XMLHttpRequest) {
        // IE7+, Firefox, Chrome, Opera, Safari
        xhr = new XMLHttpRequest();
    }
    else {
        // IE5/IE6
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    if (xhr) {
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4 && xhr.status == 200) {
                var result = JSON.parse(xhr.responseText);
                var i = 0;
                var infoContents = [];
                var icon_image = base_url+"public/images/googlemaps/marker.png";
                for (i = 0; i <= result.length; i++) {
                    var obj = result[i];
                    console.log(obj.lat);
                    
                    var myLatlng = new google.maps.LatLng(obj.lat, obj.long);
                   
                    var marker = new google.maps.Marker({
                        center: myLatlng,
                        position: myLatlng,
                        map: map,
                        animation: google.maps.Animation.DROP,
                        title: obj.name,
                        icon: icon_image
                    });

                    markers.push(marker);
                    var link = site_url + '/website/center/loadById/' + obj.id_center;
                   
                    infoContents[i] = 
                            
                        "<img class='imageMarker' src='" + base_url+ obj.url_image + "' />" 
                        +"<span class='glyphicon glyphicon-home'>&nbsp;</span><b>" + obj.name + "</b></br>" 
                        +"<span class='glyphicon glyphicon-flag'>&nbsp;</span></b>Đường "
                        +obj.street + ",Phường: " +obj.ward + ", Quận: "+ obj.district +"</b></br>"
                        + "<a href=" + link + " >Xem thêm chi tiết</a>";
                            ;
                            var infoWindow = new google.maps.InfoWindow(), marker, i;
                            google.maps.event.addListener(marker, 'click', (function (marker, i) {
                                return function () {
                                    infoWindow.setContent(infoContents[i]);
                                    infoWindow.open(map, marker);
                                };
                            })(marker, i));
                }
                index = i;
                var inner =  "<div class='notifications bottom-right'></div>";
                document.getElementById("notify").innerHTML =  inner;
                
            }
        }
        var data = new FormData();
        data.append('optionTypes', str1);
        data.append('optionDistricts', str2);
        xhr.open("POST", site_url + "/website/map/getMarker", true);
        xhr.send(data);
    }
}
function initialize() {
    //
    var centerPoint;
    centerPoint = new google.maps.LatLng(10.81779956817627, 106.6179962158203);
    var options = {
        center: centerPoint,
        zoom: 13,
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.LARGE
        }
    };
    map = new google.maps.Map(document.getElementById('map'),
            options);
            
    return map;
}
google.maps.event.addDomListener(window, 'load', initialize());